<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/static/bootstrap-3.3.7/css/bootstrap.min.css">
    <script src="/static/js/jquery-3.2.1.min.js"></script>
    <style type="text/css">
        .filter a{text-decoration: none; color: grey}
        .active{ color: red!important;}
    </style>
</head>
<body>

<h3><b>数据列表</b></h3>

<div class="container">
    <div class="row">
        <div class="col-md-9">
            <a href="{{ add_url }}" class="btn btn-success" style="margin-bottom: 5px"><b>添加数据</b></a>

            {% if showlist.config.search_fields %}
                <form class="navbar-form navbar-right">
                    <div class="input-group">
                        <input type="search" name="q" class="form-control" placeholder="Search"/>
                        <span class="input-group-btn">
                            <button class="btn btn-primary">
                                <span class="glyphicon glyphicon-search"></span>
                            </button>
                        </span>
                    </div>
                </form>
            {% endif %}

            <form action="" method="post"  >
                {% csrf_token %}
                <div style="margin-bottom: 5px">
                    <select name="action" id="" style="width: 200px; padding: 5px 8px; display: inline-block; ">
                    <option value="">----------------------------------</option>
                    {% for item in showlist.get_action_list %}
                        <option value="{{ item.name }}">{{ item.desc }}</option>
                    {% endfor %}

                    </select><button type="submit" class="btn btn-primary btn-sm">GO</button>
                </div>

                <table class="table table-bordered table-striped">
                    <thead>
                    <tr>
                        {% for item in showlist.get_header %}
                            <th>{{ item }}</th>
                        {% endfor %}
                    </tr>
                    </thead>

                    <tbody>
                    {% for data in showlist.get_body %}
                        <tr>
                            {% for item in data %}
                                <td>{{ item }}</td>
                            {% endfor %}
                        </tr>
                    {% endfor %}
                    </tbody>
                </table>

                <nav>
                    <ul class="pagination pull-right">
                        {{ showlist.pagination.page_html|safe }}
                    </ul>
                </nav>
            </form>
        </div>

        <div class="col-md-3">
            {% if showlist.config.list_filter %}
                <h4>Filter</h4>
                {% for filter_field, linktags in showlist.get_filter_linktags.items %}
                    <div class="well">
                        <p>{{ filter_field.upper }}</p>
                        {% for link in linktags %}
                            <p>{{ link|safe }}</p>
                        {% endfor %}
                    </div>
                {% endfor %}
            {% endif %}
        </div>
    </div>
</div>

<script type="text/javascript">
    $('#choice').click(function () {
        if($(this).prop('checked')){
            $('.choice_item').prop('checked',true)
        }else{
            $('.choice_item').prop('checked',false)
        }
    })
</script>

</body>
</html>
